<template>
	<view class="fui-wrap">
		<fui-result v-if="err" type="fail" title="操作失败" :descr="err">
			<fui-button @click="$reLaunch('index/index')" width="400rpx" height="84rpx" text="返回主页" type="success" bold :margin="['48rpx','0','24rpx']"></fui-button>
		</fui-result>
		<plateNumber v-if="!err && init" ref="plateNumber" :value="plate_begin" @confirm="confirmPlate" @cancel="cancelPlate"></plateNumber>
		<fui-bottom-popup :show="showParking" @close="closePopup">
			<view class="fui-scroll__wrap">
				<view class="fui-title fui-title__pb">选择停车场</view>
				<scroll-view scroll-y class="fui-scroll__view">
					<fui-list-cell v-for="(item,index) in parkinglist" :key="index" arrow @click="checkParking(item)">{{item.title}}</fui-list-cell>
				</scroll-view>
				<view class="fui-icon__close" @tap="closePopup">
					<fui-icon name="close" :size="48"></fui-icon>
				</view>
			</view>
		</fui-bottom-popup>
		<fui-modal :buttons="[]" width="600" :zIndex="9999" :show="showMember">
			<fui-icon name="comment-fill" :size="108" color="#09BE4F"></fui-icon>
			<text class="fui-title">温馨提示</text>
			<text class="fui-descr">检测到您的微信已经绑定了车牌【{{showMember.plate_number}}】</text>
			<view :style="`width: 460rpx;margin:0 auto;display: flex;justify-content: ${showMember.monthly?'space-between':'center'};`">
				<fui-button v-if="showMember.monthly && showMember.monthly.cars.rules_type=='monthly'" text="月租缴费" width="220rpx" height="72rpx" :size="28" radius="36rpx" background="#FFB703"
					borderWidth="0" @click="goMonthly">
				</fui-button>
				<fui-button v-if="showMember.monthly && showMember.monthly.cars.rules_type=='stored'" text="储值卡充值" width="220rpx" height="72rpx" :size="28" radius="36rpx" background="#FFB703"
					borderWidth="0" @click="goMonthly">
				</fui-button>
				<fui-button v-if="showMember.monthly && showMember.monthly.cars.rules_type=='day'" text="预约车续签" width="220rpx" height="72rpx" :size="28" radius="36rpx" background="#FFB703"
					borderWidth="0" @click="goMonthly">
				</fui-button>
				<fui-button text="付停车费" width="220rpx" height="72rpx" :size="28" radius="36rpx" background="#FFB703"
					borderWidth="0" @click="goRecords">
				</fui-button>
			</view>
			<view class="fui-icon__close" @tap="showMember=false">
				<fui-icon name="close" color="#B2B2B2" :size="48"></fui-icon>
			</view>
		</fui-modal>
	</view>
</template>

<script>
	import {methods,baseUrl} from '@/utils/core.js';
	import plateNumber from '@/components/common/plate.vue';
	export default {
		components:{
			plateNumber:plateNumber
		},
		data() {
			return {
				type:'',
				err:'',
				err_txt:{
					monthly_renew:'没有找到月租记录',
					stored_renew:'没有找到储值卡记录'
				},
				type_txt:{
					parking:'停车缴费',
					monthly_renew:'月卡充值续费',
					monthly_apply:'月卡申请',
					stored_renew:'储值卡充值',
					stored_apply:'储值卡申请',
					day:'日租申请'
				},
				showMember:false,
				plate_begin:'',
				parking:'',
				parkinglist:[],
				showParking:false,
				plate_number:'',
				merch_id:'',
				rules_id:'',
				init:false
			}
		},
		onLoad(e) {
			this.type=e.type;
			this.merch_id=e.merch_id || '';
			this.rules_id=e.rules_id || '';
			if(e.parking_id){
				this.getParking(e.parking_id);
			}else{
				this.init=true;
				uni.setNavigationBarTitle({
					title:this.type_txt[e.type]
				});
			}
		},
		methods: {
			...methods,
			goMonthly:function(){
				let plate_number=this.showMember.plate_number;
				if(this.showMember.monthly.cars.rules_type=='monthly'){
					this.$redirectTo('index/monthly?plate_number='+plate_number+'&parking_id='+this.parking.id);
				}
				if(this.showMember.monthly.cars.rules_type=='day'){
					this.$redirectTo('index/day?plate_number='+plate_number+'&parking_id='+this.parking.id+'&merch_id='+this.merch_id+'&rules_id='+this.rules_id);
				}
				if(this.showMember.monthly.cars.rules_type=='stored'){
					this.$redirectTo('index/stored?plate_number='+plate_number+'&parking_id='+this.parking.id);
				}
			},
			goRecords:function(){
				let parking_id=this.parking.id;
				let plate_number=this.showMember.plate_number;
				this.$redirectTo('index/parking-list?plate_number='+plate_number+'&parking_id='+parking_id);
			},
			getParking:function(id){
				this.$get('index/parking',{id:id}).then(res=>{
					this.parking=res;
					this.plate_begin=res.plate_begin;
					this.init=true;
					this.showMember=res.showMember;
					uni.setNavigationBarTitle({
						title:res.title
					});
				});
			},
			cancelPlate:function(){
				this.$reLaunch('index/index');
			},
			closePopup:function(){
				this.showParking=false;
				this.$refs.plateNumber.showKeyboard();
			},
			checkParking:function(item){
				let typetxt={
					monthly_renew:'monthly',
					stored_renew:'stored',
				};
				this.$redirectTo(`index/${typetxt[this.type]}?plate_number=${this.plate_number}&parking_id=${item.id}`)
			},
			confirmPlate:function(plate_number){
				if(this.type=='monthly_renew'){
					if(this.parking){
						this.$redirectTo('index/monthly?plate_number='+plate_number+'&parking_id='+this.parking.id);
					}else{
						this.$get('recharge/parking',{type:this.type,plate_number:plate_number}).then(res=>{
							if(res.length===0){
								this.err=this.err_txt[this.type];
							}
							if(res.length>0){
								this.$refs.plateNumber.hideKeyboard();
								this.parkinglist=res;
								this.plate_number=plate_number;
								this.showParking=true;
							}
						});
					}
				}
				if(this.type=='stored_renew'){
					if(this.parking){
						this.$redirectTo('index/stored?plate_number='+plate_number+'&parking_id='+this.parking.id);
					}else{
						this.$get('recharge/parking',{type:this.type,plate_number:plate_number}).then(res=>{
							if(res.length===0){
								this.err=this.err_txt[this.type];
							}
							if(res.length>0){
								this.$refs.plateNumber.hideKeyboard();
								this.parkinglist=res;
								this.plate_number=plate_number;
								this.showParking=true;
							}
						});
					}
				}
				if(this.type=='monthly_apply'){
					this.$redirectTo('index/monthly?plate_number='+plate_number+'&parking_id='+this.parking.id);
				}
				if(this.type=='stored_apply'){
					this.$redirectTo('index/stored?plate_number='+plate_number+'&parking_id='+this.parking.id);
				}
				if(this.type=='day_apply'){
					this.$redirectTo('index/day?plate_number='+plate_number+'&parking_id='+this.parking.id+'&merch_id='+this.merch_id+'&rules_id='+this.rules_id);
				}
				if(this.type=='parking'){
					let parking_id=this.parking?this.parking.id:'';
					this.$redirectTo('index/parking-list?plate_number='+plate_number+'&parking_id='+parking_id);
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.fui-wrap {
	background-color: #fff;
	padding-bottom: 40rpx;
}
	
.fui-title {
	font-size: 30rpx;
	font-weight: bold;
	text-align: center;
}

.fui-icon__close {
	position: absolute;
	top: 24rpx;
	left: 24rpx;
}

.fui-scroll__wrap {
	padding-top: 30rpx;
	position: relative;
}

.fui-scroll__view {
	width: 100%;
	height: 600rpx;
}

.fui-title__pb {
	padding-bottom: 24rpx;
}

.fui-descr {
	font-size: 24rpx;
	color: #B2B2B2;
	padding-top: 12rpx;
	padding-bottom: 48rpx;
}

</style>